<?php
require '../main.php';
function crear_arbol($path)
{
	echo '<ul>';
	foreach(new DirectoryIterator($path) as $child)
	{
		if(!$child->isDir() || $child->isDot() || $child->getFilename() == 'thumb' ){continue;}
		echo '		<li><a href="?dir='.strtr($child->getPathname(),array(BASE_PATH =>'',"\\"=>"/")).'">'. $child->getFilename() .'</a>';
		crear_arbol($child->getPathname());
		echo '</li>';
	}
	echo'</ul>';
}
function crear_miniatura($path_file,$thumb_size=array())
{
	
	$datos = pathinfo($path_file);
	$extensiones_validas = array("jpeg","jpg","png","gif");
	if(in_array(strtolower($datos["extension"]) , $extensiones_validas))
	{
		if(!is_file($datos["dirname"] . '/thumb/' . $datos["basename"]))
		{
			if(!is_dir($datos["dirname"] . '/thumb'))
			{
				mkdir($datos["dirname"] . '/thumb',0755);
			}
			$thumb_size = array_merge(array("x" => 150,"y" => 0) ,$thumb_size);
			$imagen = new ta_image($datos["dirname"] . '/' . $datos["basename"]);
			$imagen->resize($thumb_size["x"],$thumb_size["y"]);
			$imagen->save($datos["dirname"] . '/thumb/' .$datos["basename"]);
		}
		
	}
}
?>
<!DOCTYPE html>
<html>
	<head>
		<title>Elegir Imagenes</title>
		<meta charset="utf8"/>
		<link rel="stylesheet" href="principal.css"/>
		<script type="text/javascript" src="core.js"></script>
<style type="text/css">
body,html{width:100%;height:100%;}
.imagenes{position:relative}
.imagenes .opciones{
	position:absolute;
	top:0px;
	background-color:#000;
	visibility:hidden;
}
.imagenes .item:hover .opciones
{
	visibility:visible;
}
.imagenes .item{
	width:150px;
	height:150px;
	float:left;
	position:relative;
	border:1px solid #ccc;
	margin:5px 10px;
	border-radius:10px 5px;
	box-shadow: 0 0 10px #000000;
}
.imagenes .item a{
	position:relative;
	display:block;
	text-align:center;
}
.imagenes .item a img{
	opacity:0.7;
	display:block;
	margin:auto;
}
.imagenes .item a:hover img{opacity:1;}
.imagenes .item:hover{
	box-shadow: 0 0 10px green;
}
.imagenes .item span{
}
/*Popup*/
.popup
{
	width:100%;
	height:100%;
	background-color:snow;
	position:fixed;
	visibility:hidden;
	top:0px;
}
.popup button{
	float:right;
}
.popup #imagen{
	height:100%;
	text-align: center;
}
.popup #imagen img{
	margin:auto;
}
</style>
	</head>
	<body>
<?php require 'header.php';?>
<table class="imagenes">
	<tr valign="top">
		<td width="200px">
			<h3>Carpetas</h3>
<?php 
		crear_arbol(BASE_PATH . '/image');
?>
		</td>
		<td>
<?php
if(!empty($_GET['dir'])):
$ruta = BASE_PATH . '' . $_GET['dir'];
$directorio = is_dir($ruta)? new DirectoryIterator($ruta):array();
foreach($directorio as $file):
	if(!$file->isFile()){continue;}
	if(!is_file($file->getPathName() . '/thumb/' . $file->getFileName()))
	{
		crear_miniatura($file->getPathName(),array("x"=>"150","y"=>"130"));
	} 
$url_miniatura = BASE_URL . $_GET['dir'] . '/thumb/'.$file->getFileName();
$url = BASE_URL . $_GET['dir'] . '/'.$file->getFileName();
$nombre = $file->getFileName();
?>
		<div class="item">
			<a href="<?=$url?>">
				<img src="<?=$url_miniatura?>" alt=""/>
				<span><?=$nombre?></span>
			</a>
			<span class="opciones">
				<button onclick="agrandar('<?=$url?>')">agrandar</button>
			</span>
		</div>
<?php endforeach;
endif;
?>
<br style="clear:left;" />
		</td>
	</tr>
</table>
<div class="popup" id="popup_show">
	<button onclick="ocultar()">X Cerrar</button>
	<div id="imagen"></div>
</div>
<script type="text/javascript">
function agrandar(url)
{
	$('imagen').empty();
	$('imagen').adopt(new Element('img',{src:url}));
	$('popup_show').set("style","visibility:visible");
}
function ocultar()
{
	$('popup_show').set("style","visibility:hidden");
}
</script>
<?php require 'footer.php';?>
	</body>
</html>